<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" media="screen" type="text/css" href="__THEMES__/style/layout.css" />
		<script type="text/javascript" src="__JS__/jQuery/jquery.js"></script>
		<script type="text/javascript" src="__JS__/jQuery/plugin/jquery.filestyle.js"></script>
		<script type="text/javascript" src="__JS__/jQuery/plugin/ajaxfileupload/ajaxfileupload.js"></script>
		<script type="text/javascript" src="__JS__/jQuery/plugin/alertbox.js"></script>
		<script type="text/javascript">
			$(function(){
				$("input[type=file]").filestyle({ image : "__THEMES__/images/chk.png", imageheight : 25, imagewidth : 86, width : 260 });
				$('select[name="type"]').change(function(){
					if ($(this).val() == 'url'){
						if ($("#custom_url_tr").length > 0){
							return false;
						}else{
							var chtml = '';
							chtml += '<tr id="custom_url_tr"><td width="12%" align="right" class="left_text">自定义URL地址</td><td align="left">';
							chtml += '<input type="text" name="url" class="input_text w480" id="custom_url_path" />';
							chtml += '</td></tr>';
							$("#custom_url").after(chtml);
							$("#set_banner").remove();
						}
					}else{
						$("#custom_url_tr").remove();
						if ($("#set_banner").length == 0){
							var banner = '';
							banner += '<tr id="set_banner"><td width="12%" align="right" class="left_text">分类Banner设置</td><td align="left">';
							banner += '<span class="file_d_Upload">';
							banner += '<input id="filedata" type="file" class="attText" name="filedata">';
							banner += '<button class="attButton" id="buttonUpload" onclick="return ajaxFileUpload();">上传文件</button></span></td></tr>';
							$("#nav_html").after(banner);
							$("input[type=file]").filestyle({ image : "__THEMES__/images/chk.png", imageheight : 25, imagewidth : 86, width : 260 });
						}
					}
				});
				
				removeInputStyle('.input_text');
				
				$('form').submit(function(){
					if ( $.trim( $('#name').val() ) == '' ){
						setInputStyle( '#name' );
						setAlertBox('分类名称必须填写！', 2);
						return false;
					}
				});
			});
			
			function ajaxFileUpload(){
                if ($("#filedata").val() == ''){
                    setAlertBox('请选择要上传的文件！', 2);
                    return false;
                }else{
                    $.post("__APP__/Uploadfile/removefile",{
                    	file:"<?php if(isset($vo['banner']) && !empty($vo['banner'])){ echo $vo['banner']; } ?>"
                    },function(data){
                    	if ( data.status == 1 ){
                    		$('#old_banner').remove();
                    	}
                    },'json');
                }
                //starting setting some animation when the ajax starts and completes
                $("#loading").ajaxStart(function(){ $(this).show(); }).ajaxComplete(function(){ $(this).hide(); });
        
                $.ajaxFileUpload({
                    url:'__APP__/uploadfile/upfile', 
                    secureuri:false,
                    fileElementId:'filedata',
                    dataType: 'json',
                    success: function (data, status){
                        //alert(data.msg.url);
                        if(typeof(data.error) != 'undefined'){
                            if(data.error != ''){
                                alert(data.error);
                            }else{
                                alert(data.msg);
                            }
                        }
                        $("#set_banner").after("<tr id='banner_display'><td></td><td align='left'><img src='"+data.msg.url+"' /><input type='hidden' name='banner' value='"+data.msg.url+"' /></td></tr>");
                        $("#buttonUpload").attr("disabled","disabled");
                        $("#filedata").attr("disabled","disabled");
                        $("#buttonUpload").after("&nbsp;&nbsp;<button class='attButton' id='removebanner' onclick=\"return removeFile(this,'"+data.msg.url+"');\">删除Banner</botton>");
                    },
                    error: function (data, status, e){
                        alert(e);
                    }
                });
                return false;
            }
            function removeFile(e,s){
				$.post("{:U('uploadfile/removefile')}",{
					file:s
				},function(data){
					if ( data.status == 1 ){
						$("#buttonUpload").removeAttr("disabled");
						$("#filedata").removeAttr("disabled");
						$("#banner_display").remove();
						$(e).remove();
					}
				},'json');
				return false;
			}
		</script>
		<style type="text/css">
			table td		{ border:0; padding:7px 5px; }
			.file_d_Upload	{ position: relative; height: 26px; display:block; }
			.attText		{ border: 1px solid #DDDDDD;font-family: verdana; font-size: 12px;padding: 4px!important;width: 460px; height:15px; }
			#buttonUpload	{ position:absolute; margin-left:96px; height:25px; padding:0 10px; cursor:pointer; vertical-align:middle; font-size:12px; word-break:keep-all;  white-space:nowrap; }
			#removebanner	{ position:absolute; margin-left:170px; height:25px; padding:0 10px; cursor:pointer; vertical-align:middle; font-size:12px; word-break:keep-all;  white-space:nowrap; }
		</style>
	</head>
	<body>
		
		<include file="Public:position" />
		
		<form action="__URL__/insert" method="post" name="addCategoryPost">
    	<input type="hidden" name="pid" value="0" />
    	<input type="hidden" name="level" value="1" />
		<table width="100%" class="form_table">
			<tr>
				<td></td>
				<td></td>
			</tr>
			<tr>
				<td align="right" class="left_text">分类名称</td>
				<td align="left"><input type="text" name="name" id="name" class="input_text w480" /></td>
			</tr>
			<tr>
				<td align="right" class="left_text">语言</td>
				<td align="left">
					<input type="radio" name="lang" value="zh-cn" checked="checked" /> 中文 &nbsp;
					<input type="radio" name="lang" value="en-us" /> English &nbsp;
				</td>
			</tr>
			<tr>
				<td align="right" class="left_text">自定义模板</td>
				<td align="left"><input type="text" name="tpl" class="input_text w280" /> *无需路径，无需后缀名，填写模板文件名即可</td>
			</tr>
			<tr>
				<td align="right" class="left_text">分类唯一标识</td>
				<td align="left"><input type="text" name="channel" class="input_text w280" /> *</td>
			</tr>
			<tr>
				<td align="right" class="left_text">状态</td>
				<td align="left">
					<input type="radio" name="status" value="1" checked="checked" /> 正常 &nbsp; 
					<input type="radio" name="status" value="0" /> 隐藏
				</td>
			</tr>
			<tr id="custom_url">
				<td align="right" class="left_text">类型选择</td>
				<td align="left">
					<select name="type" class="input_text" style="width: auto;">
						<option value="">类型选择</option>
						<volist name="type_list" id="types">
						<option value="{$types.name}">{$types.title}</option>
						</volist>
					</select>
				</td>
			</tr>
			<tr id="nav_html">
				<td align="right" class="left_text">导航位置</td>
				<td align="left">
					<input type="radio" name="nav" value="top" /> 顶部 &nbsp;&nbsp;
					<input type="radio" name="nav" value="nav" checked="checked" /> 主导航 &nbsp;&nbsp;
					<input type="radio" name="nav" value="top" /> 尾部 &nbsp;&nbsp;
				</td>
			</tr>
			<tr id="set_banner">
				<td align="right" class="left_text">分类Banner设置</td>
				<td align="left">
					<span class="file_d_Upload">
						<input id="filedata" type="file" class="attText" name="filedata">
						<button class="attButton" id="buttonUpload" onclick="return ajaxFileUpload();">上传文件</button>
					</span>
				</td>
			</tr>
			<tr style="display:none;" id="loading">
				<td></td>
				<td align='left'><img src="__THEMES__/images/loading.gif" /></td>
			</tr>
			<tr>
				<td align="right" class="left_text">分类关键字</td>
				<td align="left"><input name="keyword" type="text" class="input_text w480" /> (SEO)</td>
			</tr>
			<tr>
				<td align="right" class="left_text">分类描述</td>
				<td align="left"><textarea name="description" class="input_text" style="width: 600px; height:140px;"></textarea> (SEO)</td>
			</tr>
			<tr>
				<td align="right" class="left_text"></td>
				<td align="left"><input type="submit" class="submit" value="提交表单" /></td>
			</tr>
			<tr>
				<td></td>
				<td></td>
			</tr>
		</table>
		</form>
	</body>
</html>